 // 原型对象
    function GetEle(selector) {
        this.eles = document.querySelectorAll(selector)
    }
    GetEle.prototype.html = function (con) {
        if (arguments.length >= 1) { // 如果有参数
            // for (var i = 0; i < this.eles.length; i++) {
            //     this.eles[i].innerHTML = con;
            // }
            this.each(function (eles) {
                eles.innerHTML = con;
            });
            return this;
        } else {
            return this.eles[0].innerHTML;
        }
    }
    GetEle.prototype.text = function (con) {
        if (arguments.length >= 1) { // 如果有参数
            // for (var i = 0; i < this.eles.length; i++) {
            //     this.eles[i].textContent = con;
            // }
            this.each(function (eles) {
                eles.textContent = con;
            });
            return this;
        } else {
            return this.eles[0].textContent;
        }
    }
    GetEle.prototype.val = function (con) {
        if (arguments.length >= 1) { // 如果有参数
            // for (var i = 0; i < this.eles.length; i++) {
            //     this.eles[i].value = con;
            // }
            this.each(function (eles) {
                eles.value = con;
            });
            return this;
        } else {
            return this.eles[0].value;
        }
    }
    GetEle.prototype.hide = function () {
        this.each(function (eles) {
            eles.style.display = "none";
        });
        return this;
    }
    GetEle.prototype.show = function () {
        this.each(function (eles) {
            eles.style.display = "block";
        });
        return this;
    }

    // 遍历实例化对象中的集合  每次循环时执行传入的回调函数 (item,index)
    GetEle.prototype.each = function (fn) {
        for (var i = 0; i < this.eles.length; i++) {
            var item = this.eles[i];
            var index = i;
            fn(item, i);
            // 注意 jquery中 第一个参数是下标,第二个才会循环的当前元素
            // fn(index, item);
        }
        return this;
    }
    GetEle.prototype.click = function (fn) {
        this.each(function (eles) {
            eles.onclick = fn;
        });
        return this;
    }
    GetEle.prototype.getStyle = function (attr) {
        var ele = this.eles[0];
        if (window.getComputedStyle) {
            return window.getComputedStyle(ele)[attr];
        } else {
            return ele.currentStyle[attr];
        }
    }
    GetEle.prototype.width = function (con) {
        if (arguments.length >= 1) {
            this.each(function (eles) {
                // 是否有单位?
                //   有单位   px pt  %  em rem vw  vh   => 直接拼接
                // 没有单位   200                       => 默认"px"
                var unit = /^\d+(\.\d+)?(px|pt|%|em|rem|vw|vh)$/;
                if (unit.test(con)) {
                    eles.style.width = con;
                } else {
                    eles.style.width = con + "px";
                }
            });
            return this;
        } else {
            return parseInt(this.getStyle("width"));
        }
    }
    GetEle.prototype.height = function (con) {
        if (arguments.length >= 1) {
            this.each(function (eles) {
                // 是否有单位?
                //   有单位   px pt  %  em rem vw  vh   => 直接拼接
                // 没有单位   200                       => 默认"px"
                var unit = /^\d+(\.\d+)?(px|pt|%|em|rem|vw|vh)$/;
                if (unit.test(con)) {
                    eles.style.height = con;
                } else {
                    eles.style.height = con + "px";
                }
            });
            return this;
        } else {
            return parseInt(this.getStyle("height"));
        }
    }
    // attr()   获取和设置标签内的属性(属性节点)
    // attr(key,val) 两个参数    setAttribute()
    // attr(key)     一个参数    getAttribute()
    GetEle.prototype.attr = function (key, val) {
        if (arguments.length >= 2) {
            this.each(function (eles) {
                eles.setAttribute(key, val);
            });
            return this;
        } else if (arguments.length == 1) {
            return this.eles[0].getAttribute(key);
        } else {
            var err = new SyntaxError("place entry at least one paramter!");
            throw err;
        }
    }
    // prop()   获取和设置元素节点的属性
    // prop(key,val)  两个参数    ele.className = "a"
    // prop(key)      一个参数    ele.className
    GetEle.prototype.prop = function (key, val) {
        if (arguments.length >= 2) {  //两个参数
            this.each(function (eles) {
                eles[key] = val;
            });
            return this;
        } else if (arguments.length == 1) { //一个参数
            return this.eles[0][key];
        } else {
            var err = new SyntaxError("place entry at least one paramter!");
            throw err;
        }
    }
    // css()   获取和设置元素的样式
    // css("background","red")   两个参数 设置样式
    // css("background")         一个参数 获取样式
    GetEle.prototype.css = function (key, val) {
        if (arguments.length >= 2) {  //两个参数
            this.each(function (eles) {
                eles.style[key] = val;
            });
            return this;
        } else if (arguments.length == 1) { //一个参数
            if (typeof arguments[0] == "[object Object]") {
                for (var k in arguments[0]) {
                    var v = arguments[0][k];
                    this.css(k, v);
                }
                return this;
            } else if (typeof arguments[0] == "[string String]") {
                return this.eles[0][key];
            }
        } else {
            var err = new SyntaxError("place entry at least one paramter!");
            throw err;
        }
    }
    // addClass()   向匹配的元素中添加一个或多个class名  多个class名空格分隔
    GetEle.prototype.addClass = function (con) {
        var list = con.split(" ");
        this.each(function (eles) {
            eles.classList.add(...list);
        });
        return this;
    }
    // removeClass()   向匹配的元素中添加一个或多个class名  多个class名空格分隔
    GetEle.prototype.removeClass = function (con) {
        var list = con.split(" ");
        this.each(function (eles) {
            eles.classList.remove(...list);
        });
        return this;
    }
    // eq(index)    返回对应下标元素形成的实例化对象  => 对应下标取值
    // $(".list li").eq(0).css()  => eq() 方法返回的也是一个实例化对象
    // {eles:[li,li,li,li,li,li]}   =>  {eles:[li]} 
    GetEle.prototype.eq = function (index) {
        // var ele = this.eles[index];
        this.eles = [this.eles[index]];
        return this;
    }
    // siblings()   返回 除被选中元素之外 所有的同级元素形成的实例化对象
    // $(".list li").eq(0).siblings().css()  // 同级元素中 除第一个以外的 其他所有同级元素
    GetEle.prototype.siblings = function () {
        var ele = this.eles[0];
        var pare = ele.parentElement;
        var children = pare.children;
        var list = Array.from(children).filter(item => item != ele);
        this.eles = list;
        return this;
    }

    // 对GetEle进行二次封装  => 快速创建实例化对象并返回
    function $(selector) {
        return new GetEle(selector)
    }